<template>
  <section class="inConbox clearfix order_assistant"> 
    <!-- 头部 -->
    <Nav :URL="urls.url" :text="urls.text"></Nav>
    <!-- 发布信息 -->
    <div class="Verification_box dipW clearfix">
      <hgroup class="Verifi_child_title wid_pad">身份认证</hgroup>
      <section class="Verifi_input_box clearfix">
        <input type="text" class="Verifi_name_number bdr Verifi_bom" placeholder="请输入您的真实姓名" v-model="UserName">
        <input type="text" class="Verifi_name_number bdr" placeholder="请输入您的身份证号" v-model="Identitynumber">
      </section>
      <section class="Verifi_input_box clearfix">
        <input type="text" class="Verifi_name_number bdr" placeholder="请输入您的手机号码" v-model="Poennumber">
        <button class="Verifif_btn bdr" :class="{'Verifi_btn_active':this.btnAcetive}" @click="getPostRuter()">下一步</button>
      </section>
    </div>
  </section>
</template>
<script>
import Nav from '../mallConent/mallTopNav'
import bus from '../../../src/assets/bus/js/bus.js'
export default {
  data(){
    return{
      urls:{
        url:'',
        text:'接单助手',
      },
      btnAcetive:false, //点击样式
      UserName:'', //名字
      Identitynumber:'', //身份号
      Poennumber:'', // 手机号
    }
  }, 
  components:{Nav}, //引入组件
  methods:{
    getPostRuter(){
      if(this.UserName == '' || !bus.Name().test(this.UserName)){
        alert('真实姓名填写有误,请重新输入2-7位')
        this.UserName = ''
      }else if(this.Identitynumber == '' || !bus.userIDent().test(this.Identitynumber)){
        alert('身份证号输入格式有误,请重新输入15-18位')
        this.Identitynumber = ''
      }else if(this.Poennumber == '' || !bus.number().test(this.Poennumber)){
        alert('手机号输入格式有误,请重新输入11位')
        this.Poennumber = ''
      }else{
        this.$router.push({
          path:'/bomNav/Ordershuo/userassispay'
        })
        var userIFon = {
          username:this.UserName,
          userIdent:this.Identitynumber,
          userPoen:this.Poennumber
        }
        sessionStorage.setItem('userassisIFon',JSON.stringify(userIFon))
        // console.log(JSON.parse(sessionStorage.getItem('userassisIFon')))
      }
      this.btnAcetive = true;
    }
  },
  created(){
    
  },

}
</script>
<style lang="scss" scoped>
.order_assistant{
  margin: 0rem;
  z-index: 51;
  height: 100%;
  background: #fff;
  // position: fixed;
  position: relative;
}
.Verification_box{
  width: 100%;
  position: relative;
  font-size: .24rem;
  margin-top:.8rem;
  .Verifi_child_title{
    width: 100%;
    height: 0.86rem;
    background: #fff;
    
    color:#333;
    text-align:left;
    line-height:.86rem;
    font-weight:600;
  }
  .Verifi_input_box{
    border-top:.02rem solid #f2f2f2;
    width: 100%;
    background: #fff;
    padding:.38rem .4rem;
    .Verifi_name_number{
      width: 100%;
      height: 0.8rem;
      background: #EEEEEE;
      padding:.3rem .4rem;
      color: #333;
    }
    .Verifi_bom{
      margin-bottom:.22rem;
    }
  }
  .Verifif_btn{
    width: 100%;
    height: 1rem;
    background:#FF7200;
    font-size:.3rem;
    color:#fff;
    text-align: center;
    margin-top:.38rem;
    line-height: 1rem;
  }
  .Verifi_btn_active{
    background: #e56600;
  }
}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { 
  color: #AEAEAE;
} 
input:-moz-placeholder, textarea:-moz-placeholder { 
  color: #AEAEAE;
} 
input::-moz-placeholder, textarea::-moz-placeholder { 
  color: #AEAEAE;
} 
input:-ms-input-placeholder, textarea:-ms-input-placeholder { 
  color: #AEAEAE;
} 
</style>
